import React, { useState, useEffect, useMemo } from "react";
import { 
  Card, 
  List, 
  Tag, 
  Button, 
  Space, 
  Input, 
  Select, 
  Row, 
  Col, 
  Statistic, 
  Empty, 
  Tooltip, 
  Badge,
  Typography,
  Divider,
  Collapse,
  Checkbox,
  Radio,
  Tabs,
  message,
  Spin,
  Avatar,
  Progress,
  Alert,
  Drawer,
  Tree,
  Breadcrumb,
} from "antd";
import {
  FileOutlined,
  FolderOutlined,
  DownloadOutlined,
  SearchOutlined,
  FilePdfOutlined,
  FileWordOutlined,
  FilePptOutlined,
  FileZipOutlined,
  FileExcelOutlined,
  FileTextOutlined,
  BookOutlined,
  ExperimentOutlined,
  ToolOutlined,
  FileProtectOutlined,
  VideoCameraOutlined,
  AudioOutlined,
  PictureOutlined,
  FilterOutlined,
  SortAscendingOutlined,
  SortDescendingOutlined,
  EyeOutlined,
  StarOutlined,
  ClockCircleOutlined,
  CloudDownloadOutlined,
  FolderOpenOutlined,
  HomeOutlined,
} from "@ant-design/icons";
import styled from "styled-components";

const { Search } = Input;
const { Title, Text, Paragraph } = Typography;
const { Panel } = Collapse;
const { TabPane } = Tabs;

// 样式组件
const StyledCard = styled(Card)`
  margin-bottom: 24px;
  .ant-card-head-title {
    font-weight: bold;
  }
`;

const ResourceCard = styled(Card)`
  margin-bottom: 16px;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
  
  &:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
  }
  
  .ant-card-body {
    padding: 16px;
  }
`;

const FilterPanel = styled(Card)`
  margin-bottom: 16px;
  .ant-card-body {
    padding: 16px;
  }
`;

const ResourceItem = styled.div`
  padding: 16px;
  border-radius: 8px;
  border: 1px solid #f0f0f0;
  margin-bottom: 12px;
  transition: all 0.3s ease;
  
  &:hover {
    border-color: #1890ff;
    background-color: #f8f9fa;
  }
`;

interface Resource {
  id: string;
  name: string;
  course: string;
  courseId: string;
  type: string;
  subType?: string;
  size: string;
  sizeInBytes: number;
  uploadTime: string;
  downloads: number;
  description?: string;
  tags?: string[];
  isNew?: boolean;
  isPopular?: boolean;
  fileExtension: string;
  previewUrl?: string;
  downloadUrl?: string;
  uploader?: string;
  rating?: number;
  viewCount?: number;
}

const StudentResources: React.FC = () => {
  const [resources, setResources] = useState<Resource[]>([]);
  const [filteredResources, setFilteredResources] = useState<Resource[]>([]);
  const [loading, setLoading] = useState(true);
  const [searchText, setSearchText] = useState("");
  const [selectedCourse, setSelectedCourse] = useState<string>("all");
  const [selectedType, setSelectedType] = useState<string>("all");
  const [selectedSubType, setSelectedSubType] = useState<string>("all");
  const [sortBy, setSortBy] = useState<string>("uploadTime");
  const [sortOrder, setSortOrder] = useState<"asc" | "desc">("desc");
  const [viewMode, setViewMode] = useState<"list" | "grid">("list");
  const [filterDrawerVisible, setFilterDrawerVisible] = useState(false);
  const [selectedTags, setSelectedTags] = useState<string[]>([]);
  const [showOnlyNew, setShowOnlyNew] = useState(false);
  const [showOnlyPopular, setShowOnlyPopular] = useState(false);

  // 静态真实数据
  const mockResources: Resource[] = [
    {
      id: "1",
      name: "数据结构与算法教材",
      course: "数据结构与算法",
      courseId: "cs101",
      type: "教材",
      subType: "理论教材",
      size: "18.5MB",
      sizeInBytes: 18500000,
      uploadTime: "2024-09-01",
      downloads: 234,
      description: "涵盖线性表、栈、队列、树、图等基础数据结构，以及相关算法的实现和应用。",
      tags: ["数据结构", "算法", "基础理论"],
      isNew: false,
      isPopular: true,
      fileExtension: "pdf",
      uploader: "张教授",
      rating: 4.8,
      viewCount: 567
    },
    {
      id: "2",
      name: "链表实现实验指导",
      course: "数据结构与算法",
      courseId: "cs101",
      type: "实验资料",
      subType: "实验指导",
      size: "3.2MB",
      sizeInBytes: 3200000,
      uploadTime: "2024-12-15",
      downloads: 156,
      description: "详细的链表实现实验步骤和代码示例，包含单链表、双链表、循环链表的实现。",
      tags: ["链表", "实验", "代码示例"],
      isNew: true,
      isPopular: false,
      fileExtension: "docx",
      uploader: "李老师",
      rating: 4.5,
      viewCount: 234
    },
    {
      id: "3",
      name: "数据库系统原理课件",
      course: "数据库系统原理",
      courseId: "cs201",
      type: "课件",
      subType: "教学课件",
      size: "12.8MB",
      sizeInBytes: 12800000,
      uploadTime: "2024-09-01",
      downloads: 198,
      description: "数据库系统原理课程的教学课件，包含关系数据库、SQL语言、数据库设计等内容。",
      tags: ["数据库", "SQL", "关系模型"],
      isNew: false,
      isPopular: true,
      fileExtension: "pptx",
      uploader: "王教授",
      rating: 4.7,
      viewCount: 445
    },
    {
      id: "4",
      name: "SQL编程实验手册",
      course: "数据库系统原理",
      courseId: "cs201",
      type: "实验资料",
      subType: "实验手册",
      size: "5.6MB",
      sizeInBytes: 5600000,
      uploadTime: "2024-12-10",
      downloads: 145,
      description: "SQL编程实验的详细手册，包含数据库创建、表操作、查询语句等实验内容。",
      tags: ["SQL", "数据库操作", "实验"],
      isNew: true,
      isPopular: false,
      fileExtension: "pdf",
      uploader: "陈老师",
      rating: 4.6,
      viewCount: 189
    },
    {
      id: "5",
      name: "计算机网络协议详解",
      course: "计算机网络",
      courseId: "cs301",
      type: "教材",
      subType: "理论教材",
      size: "22.3MB",
      sizeInBytes: 22300000,
      uploadTime: "2024-09-01",
      downloads: 167,
      description: "深入讲解TCP/IP协议栈、网络层、传输层等网络协议的工作原理。",
      tags: ["网络协议", "TCP/IP", "网络层"],
      isNew: false,
      isPopular: true,
      fileExtension: "pdf",
      uploader: "刘教授",
      rating: 4.9,
      viewCount: 378
    },
    {
      id: "6",
      name: "Wireshark网络分析实验",
      course: "计算机网络",
      courseId: "cs301",
      type: "实验资料",
      subType: "实验工具",
      size: "8.9MB",
      sizeInBytes: 8900000,
      uploadTime: "2024-12-18",
      downloads: 89,
      description: "Wireshark网络抓包分析实验，包含实验环境和操作指南。",
      tags: ["Wireshark", "网络分析", "抓包"],
      isNew: true,
      isPopular: false,
      fileExtension: "zip",
      uploader: "赵老师",
      rating: 4.4,
      viewCount: 123
    },
    {
      id: "7",
      name: "软件工程开发流程",
      course: "软件工程",
      courseId: "cs401",
      type: "教材",
      subType: "理论教材",
      size: "15.7MB",
      sizeInBytes: 15700000,
      uploadTime: "2024-09-01",
      downloads: 123,
      description: "软件工程开发流程的详细介绍，包括需求分析、设计、编码、测试等阶段。",
      tags: ["软件工程", "开发流程", "项目管理"],
      isNew: false,
      isPopular: false,
      fileExtension: "pdf",
      uploader: "孙教授",
      rating: 4.3,
      viewCount: 256
    },
    {
      id: "8",
      name: "敏捷开发实践案例",
      course: "软件工程",
      courseId: "cs401",
      type: "案例资料",
      subType: "实践案例",
      size: "4.1MB",
      sizeInBytes: 4100000,
      uploadTime: "2024-12-05",
      downloads: 78,
      description: "敏捷开发方法的实践案例，包含Scrum、Kanban等敏捷方法的实际应用。",
      tags: ["敏捷开发", "Scrum", "实践案例"],
      isNew: true,
      isPopular: false,
      fileExtension: "docx",
      uploader: "周老师",
      rating: 4.2,
      viewCount: 145
    },
    {
      id: "9",
      name: "计算机组成原理实验指导",
      course: "计算机组成原理",
      courseId: "cs501",
      type: "实验资料",
      subType: "实验指导",
      size: "7.3MB",
      sizeInBytes: 7300000,
      uploadTime: "2024-12-12",
      downloads: 112,
      description: "计算机组成原理课程的实验指导，包含CPU设计、存储器、总线等实验。",
      tags: ["计算机组成", "CPU设计", "实验"],
      isNew: true,
      isPopular: false,
      fileExtension: "pdf",
      uploader: "吴老师",
      rating: 4.1,
      viewCount: 167
    },
    {
      id: "10",
      name: "操作系统内核设计",
      course: "操作系统原理",
      courseId: "cs601",
      type: "教材",
      subType: "理论教材",
      size: "19.2MB",
      sizeInBytes: 19200000,
      uploadTime: "2024-09-01",
      downloads: 145,
      description: "操作系统内核设计的详细教材，包含进程管理、内存管理、文件系统等内容。",
      tags: ["操作系统", "内核设计", "系统编程"],
      isNew: false,
      isPopular: true,
      fileExtension: "pdf",
      uploader: "郑教授",
      rating: 4.7,
      viewCount: 289
    },
    {
      id: "11",
      name: "进程管理实验代码",
      course: "操作系统原理",
      courseId: "cs601",
      type: "实验资料",
      subType: "实验代码",
      size: "6.8MB",
      sizeInBytes: 6800000,
      uploadTime: "2024-12-08",
      downloads: 134,
      description: "进程管理相关的实验代码，包含进程创建、调度、同步等实验。",
      tags: ["进程管理", "系统编程", "实验代码"],
      isNew: true,
      isPopular: false,
      fileExtension: "zip",
      uploader: "冯老师",
      rating: 4.0,
      viewCount: 198
    },
    {
      id: "12",
      name: "算法可视化演示工具",
      course: "数据结构与算法",
      courseId: "cs101",
      type: "工具软件",
      subType: "演示工具",
      size: "25.6MB",
      sizeInBytes: 25600000,
      uploadTime: "2024-12-20",
      downloads: 67,
      description: "算法可视化演示工具，可以动态展示各种算法的执行过程。",
      tags: ["算法可视化", "演示工具", "教学辅助"],
      isNew: true,
      isPopular: false,
      fileExtension: "exe",
      uploader: "黄老师",
      rating: 4.6,
      viewCount: 89
    }
  ];

  // 获取所有课程
  const courses = useMemo(() => {
    const courseSet = new Set(resources.map(r => r.course));
    return Array.from(courseSet).map(course => ({
      label: course,
      value: course
    }));
  }, [resources]);

  // 获取所有资源类型
  const resourceTypes = useMemo(() => {
    const typeSet = new Set(resources.map(r => r.type));
    return Array.from(typeSet).map(type => ({
      label: type,
      value: type
    }));
  }, [resources]);

  // 获取所有子类型
  const subTypes = useMemo(() => {
    const subTypeSet = new Set(resources.map(r => r.subType).filter(Boolean));
    return Array.from(subTypeSet).map(subType => ({
      label: subType!,
      value: subType!
    }));
  }, [resources]);

  // 获取所有标签
  const allTags = useMemo(() => {
    const tagSet = new Set(resources.flatMap(r => r.tags || []));
    return Array.from(tagSet);
  }, [resources]);

  // 加载数据
  useEffect(() => {
    const loadResources = async () => {
      setLoading(true);
      try {
        // 模拟API调用
        await new Promise(resolve => setTimeout(resolve, 1000));
        setResources(mockResources);
      } catch (error) {
        message.error("加载资源失败");
      } finally {
        setLoading(false);
      }
    };

    loadResources();
  }, []);

  // 过滤和排序资源
  useEffect(() => {
    let filtered = [...resources];

    // 搜索过滤
    if (searchText) {
      filtered = filtered.filter(resource =>
        resource.name.toLowerCase().includes(searchText.toLowerCase()) ||
        resource.description?.toLowerCase().includes(searchText.toLowerCase()) ||
        resource.tags?.some(tag => tag.toLowerCase().includes(searchText.toLowerCase()))
      );
    }

    // 课程过滤
    if (selectedCourse !== "all") {
      filtered = filtered.filter(resource => resource.course === selectedCourse);
    }

    // 类型过滤
    if (selectedType !== "all") {
      filtered = filtered.filter(resource => resource.type === selectedType);
    }

    // 子类型过滤
    if (selectedSubType !== "all") {
      filtered = filtered.filter(resource => resource.subType === selectedSubType);
    }

    // 标签过滤
    if (selectedTags.length > 0) {
      filtered = filtered.filter(resource =>
        resource.tags?.some(tag => selectedTags.includes(tag))
      );
    }

    // 新资源过滤
    if (showOnlyNew) {
      filtered = filtered.filter(resource => resource.isNew);
    }

    // 热门资源过滤
    if (showOnlyPopular) {
      filtered = filtered.filter(resource => resource.isPopular);
    }

    // 排序
    filtered.sort((a, b) => {
      let comparison = 0;
      switch (sortBy) {
        case "uploadTime":
          comparison = new Date(a.uploadTime).getTime() - new Date(b.uploadTime).getTime();
          break;
        case "downloads":
          comparison = a.downloads - b.downloads;
          break;
        case "size":
          comparison = a.sizeInBytes - b.sizeInBytes;
          break;
        case "name":
          comparison = a.name.localeCompare(b.name);
          break;
        case "rating":
          comparison = (a.rating || 0) - (b.rating || 0);
          break;
        default:
          comparison = 0;
      }
      return sortOrder === "asc" ? comparison : -comparison;
    });

    setFilteredResources(filtered);
  }, [resources, searchText, selectedCourse, selectedType, selectedSubType, selectedTags, showOnlyNew, showOnlyPopular, sortBy, sortOrder]);

  // 获取文件图标
  const getFileIcon = (extension: string, type: string) => {
    switch (extension.toLowerCase()) {
      case "pdf":
        return <FilePdfOutlined style={{ fontSize: 24, color: '#ff4d4f' }} />;
      case "docx":
      case "doc":
        return <FileWordOutlined style={{ fontSize: 24, color: '#1890ff' }} />;
      case "pptx":
      case "ppt":
        return <FilePptOutlined style={{ fontSize: 24, color: '#fa8c16' }} />;
      case "zip":
      case "rar":
        return <FileZipOutlined style={{ fontSize: 24, color: '#52c41a' }} />;
      case "xlsx":
      case "xls":
        return <FileExcelOutlined style={{ fontSize: 24, color: '#52c41a' }} />;
      case "exe":
        return <ToolOutlined style={{ fontSize: 24, color: '#722ed1' }} />;
      default:
        return <FileTextOutlined style={{ fontSize: 24, color: '#8c8c8c' }} />;
    }
  };

  // 获取类型图标
  const getTypeIcon = (type: string) => {
    switch (type) {
      case "教材":
        return <BookOutlined />;
      case "实验资料":
        return <ExperimentOutlined />;
      case "课件":
        return <FilePptOutlined />;
      case "案例资料":
        return <FileProtectOutlined />;
      case "工具软件":
        return <ToolOutlined />;
      default:
        return <FileOutlined />;
    }
  };

  // 处理下载
  const handleDownload = (resource: Resource) => {
    message.success(`开始下载: ${resource.name}`);
    // 这里应该调用实际的下载API
  };

  // 处理预览
  const handlePreview = (resource: Resource) => {
    if (resource.previewUrl) {
      window.open(resource.previewUrl, '_blank');
    } else {
      message.info("该文件暂不支持预览");
    }
  };

  // 渲染资源项
  const renderResourceItem = (resource: Resource) => (
    <ResourceItem key={resource.id}>
      <Row gutter={16} align="middle">
        <Col span={2}>
          <div style={{ textAlign: 'center' }}>
            {getFileIcon(resource.fileExtension, resource.type)}
          </div>
        </Col>
        
        <Col span={16}>
          <div style={{ marginBottom: 8 }}>
            <Space>
              <Title level={5} style={{ margin: 0 }}>
                {resource.name}
              </Title>
              {resource.isNew && <Badge count="NEW" style={{ backgroundColor: '#52c41a' }} />}
              {resource.isPopular && <Badge count="HOT" style={{ backgroundColor: '#ff4d4f' }} />}
            </Space>
          </div>
          
          <div style={{ marginBottom: 8 }}>
            <Space wrap>
              <Tag color="blue" icon={getTypeIcon(resource.type)}>
                {resource.type}
              </Tag>
              {resource.subType && (
                <Tag color="cyan">{resource.subType}</Tag>
              )}
              <Tag color="purple">{resource.course}</Tag>
              {resource.tags?.slice(0, 3).map(tag => (
                <Tag key={tag}>{tag}</Tag>
              ))}
            </Space>
          </div>
          
          <div style={{ marginBottom: 8 }}>
            <Space split={<Divider type="vertical" />}>
              <Text type="secondary">
                <CloudDownloadOutlined /> {resource.downloads} 次下载
              </Text>
              <Text type="secondary">
                <EyeOutlined /> {resource.viewCount || 0} 次查看
              </Text>
              <Text type="secondary">
                <StarOutlined /> {resource.rating || 0} 分
              </Text>
              <Text type="secondary">
                <ClockCircleOutlined /> {resource.uploadTime}
              </Text>
              <Text type="secondary">
                大小: {resource.size}
              </Text>
            </Space>
          </div>
          
          {resource.description && (
            <Paragraph ellipsis={{ rows: 2 }} style={{ margin: 0, fontSize: '12px', color: '#666' }}>
              {resource.description}
            </Paragraph>
          )}
        </Col>
        
        <Col span={6} style={{ textAlign: 'right' }}>
          <Space direction="vertical" size="small">
            <Button 
              type="primary" 
              icon={<DownloadOutlined />}
              onClick={() => handleDownload(resource)}
            >
              下载
            </Button>
            <Button 
              icon={<EyeOutlined />}
              onClick={() => handlePreview(resource)}
            >
              预览
            </Button>
          </Space>
        </Col>
      </Row>
    </ResourceItem>
  );

  // 统计信息
  const stats = {
    total: resources.length,
    totalSize: resources.reduce((sum, r) => sum + r.sizeInBytes, 0),
    totalDownloads: resources.reduce((sum, r) => sum + r.downloads, 0),
    newResources: resources.filter(r => r.isNew).length,
    popularResources: resources.filter(r => r.isPopular).length,
  };

  return (
    <div style={{ padding: "24px" }}>
      {/* 统计信息 */}
      <Row gutter={16} style={{ marginBottom: 24 }}>
        <Col span={6}>
          <Statistic
            title="总资源数"
            value={stats.total}
            prefix={<FileOutlined />}
          />
        </Col>
        <Col span={6}>
          <Statistic
            title="总下载量"
            value={stats.totalDownloads}
            prefix={<CloudDownloadOutlined />}
          />
        </Col>
        <Col span={6}>
          <Statistic
            title="新资源"
            value={stats.newResources}
            valueStyle={{ color: '#52c41a' }}
            prefix={<Badge count="NEW" style={{ backgroundColor: '#52c41a' }} />}
          />
        </Col>
        <Col span={6}>
          <Statistic
            title="热门资源"
            value={stats.popularResources}
            valueStyle={{ color: '#ff4d4f' }}
            prefix={<Badge count="HOT" style={{ backgroundColor: '#ff4d4f' }} />}
          />
        </Col>
      </Row>

      {/* 筛选面板 */}
      <FilterPanel>
        <Row gutter={16} align="middle">
          <Col span={6}>
            <Search
              placeholder="搜索资源名称、描述或标签..."
              value={searchText}
              onChange={(e) => setSearchText(e.target.value)}
              allowClear
            />
          </Col>
          <Col span={3}>
            <Select
              placeholder="选择课程"
              value={selectedCourse}
              onChange={setSelectedCourse}
              style={{ width: '100%' }}
              options={[{ label: "全部课程", value: "all" }, ...courses]}
            />
          </Col>
          <Col span={3}>
            <Select
              placeholder="选择类型"
              value={selectedType}
              onChange={setSelectedType}
              style={{ width: '100%' }}
              options={[{ label: "全部类型", value: "all" }, ...resourceTypes]}
            />
          </Col>
          <Col span={3}>
            <Select
              placeholder="排序方式"
              value={sortBy}
              onChange={setSortBy}
              style={{ width: '100%' }}
              options={[
                { label: "上传时间", value: "uploadTime" },
                { label: "下载次数", value: "downloads" },
                { label: "文件大小", value: "size" },
                { label: "文件名", value: "name" },
                { label: "评分", value: "rating" },
              ]}
            />
          </Col>
          <Col span={2}>
            <Button
              icon={sortOrder === "asc" ? <SortAscendingOutlined /> : <SortDescendingOutlined />}
              onClick={() => setSortOrder(sortOrder === "asc" ? "desc" : "asc")}
            >
              {sortOrder === "asc" ? "升序" : "降序"}
            </Button>
          </Col>
          <Col span={3}>
            <Button
              icon={<FilterOutlined />}
              onClick={() => setFilterDrawerVisible(true)}
            >
              高级筛选
            </Button>
          </Col>
          <Col span={4}>
            <Space>
              <Checkbox
                checked={showOnlyNew}
                onChange={(e) => setShowOnlyNew(e.target.checked)}
              >
                只看新资源
              </Checkbox>
              <Checkbox
                checked={showOnlyPopular}
                onChange={(e) => setShowOnlyPopular(e.target.checked)}
              >
                只看热门
              </Checkbox>
            </Space>
          </Col>
        </Row>
      </FilterPanel>

      {/* 资源列表 */}
      <StyledCard title="学习资源">
        {loading ? (
          <div style={{ textAlign: 'center', padding: '50px' }}>
            <Spin size="large" />
            <div style={{ marginTop: 16 }}>正在加载资源...</div>
          </div>
        ) : filteredResources.length === 0 ? (
          <Empty
            description="暂无符合条件的资源"
            image={Empty.PRESENTED_IMAGE_SIMPLE}
          />
        ) : (
          <div>
            <div style={{ marginBottom: 16 }}>
              <Text type="secondary">
                共找到 {filteredResources.length} 个资源
              </Text>
            </div>
            {filteredResources.map(renderResourceItem)}
          </div>
        )}
      </StyledCard>

      {/* 高级筛选抽屉 */}
      <Drawer
        title="高级筛选"
        placement="right"
        width={400}
        open={filterDrawerVisible}
        onClose={() => setFilterDrawerVisible(false)}
      >
        <div style={{ marginBottom: 24 }}>
          <Title level={5}>子类型筛选</Title>
          <Radio.Group
            value={selectedSubType}
            onChange={(e) => setSelectedSubType(e.target.value)}
            style={{ width: '100%' }}
          >
            <Space direction="vertical" style={{ width: '100%' }}>
              <Radio value="all">全部子类型</Radio>
              {subTypes.map(subType => (
                <Radio key={subType.value} value={subType.value}>
                  {subType.label}
                </Radio>
              ))}
            </Space>
          </Radio.Group>
        </div>

        <div style={{ marginBottom: 24 }}>
          <Title level={5}>标签筛选</Title>
          <Checkbox.Group
            value={selectedTags}
            onChange={setSelectedTags}
            style={{ width: '100%' }}
          >
            <div style={{ display: 'grid', gridTemplateColumns: 'repeat(2, 1fr)', gap: 8 }}>
              {allTags.map(tag => (
                <Checkbox key={tag} value={tag}>
                  {tag}
                </Checkbox>
              ))}
            </div>
          </Checkbox.Group>
        </div>

        <div style={{ marginBottom: 24 }}>
          <Title level={5}>文件类型</Title>
          <Checkbox.Group style={{ width: '100%' }}>
            <div style={{ display: 'grid', gridTemplateColumns: 'repeat(2, 1fr)', gap: 8 }}>
              <Checkbox value="pdf">PDF文档</Checkbox>
              <Checkbox value="docx">Word文档</Checkbox>
              <Checkbox value="pptx">PPT演示</Checkbox>
              <Checkbox value="zip">压缩包</Checkbox>
              <Checkbox value="exe">可执行文件</Checkbox>
            </div>
          </Checkbox.Group>
        </div>

        <div style={{ marginBottom: 24 }}>
          <Title level={5}>上传时间</Title>
          <Radio.Group style={{ width: '100%' }}>
            <Space direction="vertical" style={{ width: '100%' }}>
              <Radio value="all">全部时间</Radio>
              <Radio value="today">今天</Radio>
              <Radio value="week">本周</Radio>
              <Radio value="month">本月</Radio>
              <Radio value="quarter">本季度</Radio>
            </Space>
          </Radio.Group>
        </div>

        <div style={{ position: 'absolute', bottom: 0, left: 0, right: 0, padding: '16px', borderTop: '1px solid #f0f0f0' }}>
          <Space style={{ width: '100%', justifyContent: 'space-between' }}>
            <Button onClick={() => {
              setSelectedSubType("all");
              setSelectedTags([]);
              setShowOnlyNew(false);
              setShowOnlyPopular(false);
            }}>
              重置筛选
            </Button>
            <Button type="primary" onClick={() => setFilterDrawerVisible(false)}>
              应用筛选
            </Button>
          </Space>
        </div>
      </Drawer>
    </div>
  );
};

export default StudentResources;
